<template>
    <div ref="lotOptions" class="flex-box flex-wp opt-pad">
        <div :class="{
                'flex-bap wd-16' : circle,
                'flex-f1' : title[1].indexOf('和数')>-1,
                'wd-25' : !circle && title[1].indexOf('和数')<0
            }" v-for="(item,i) in content" :key="i">
            <div :id="playType+title[0]+item[2]+item[3]"
            :class="{
                'option-box' : !circle,
                'option-box-cir' : circle,
                'bg-c-wh' : classFil(item) < 0,
                'bg-c-sel' : classFil(item) > -1 
            }"
            @click="chooseLot(item, i, odds)">
                <div :class="{ 'mar-t-25' : circle }">{{ item[0] }}</div>
                <div class="odds">{{ odds | theOdds(playType, i, title[0], item[1]) | noOdds($store.state.lotStatus) }}</div>
            </div>
        </div>
    </div>
</template>

<script type="text/ecmascript-6">
import 'common/css/lottery.css'
import { choose } from '../../common/js/common'
export default {
    data () {
        return {
        }
    },
    created () {
    },
    props: {
        title : Array,
        content : Array,
        odds : [Object, Array, String],
        playType : String,
        circle : Boolean
    }, 
    filters : {
        // 赔率选取
        theOdds : function(odds, type, kd, yzzh, other){
            type = type ? type.slice(3) : ''
            if(typeof odds == 'string'){
                return odds
            }else if(type == 'kd'){
                return odds[kd]
            }else if(type == 'yzzh'){
                if(yzzh == 'q5'){
                    return odds.qw
                }else{
                    return odds.qszshs
                }
            }else{
                return odds[other]
            }
        },
        // 封盘时不显示赔率
        noOdds : function(value, status){
            if(status == 1){
                return value
            }else{
                return '--'
            }
        }
    },
    methods : {
        // 选择彩票玩法
        chooseLot (data, i, odds) {
            //使用this.$options.filters[]方式获取本地过滤器
            const theOdds = this.$options.filters['theOdds']
            //调用本地过滤器
            odds = theOdds(odds, this.playType, i, this.title[0], data[1])
            choose(this.playType, this.title, data, odds)
        },
        classFil (data) {
            let id = this.playType+this.title[0]+data[2]+data[3]
            return this.$store.state.lotOptions.indexOf(id)
        }
    }
}
</script>

<style scoped lang="stylus" rel="stylesheet/stylus">
</style>